<div id="gallery">
    <h1>Galéria</h1>
    
    <div class="breadcrumb">Itt vagy most: <span class="greenText">Rólunk</span> <span class="breadcrumb-spearator">-></span> Galéria</div>

<div class="popup-gallery">
	<a href="images/galery/kep_01.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_01_mini.jpg"></a>
	<a href="images/galery/kep_02.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_02_mini.jpg"></a>
	<a href="images/galery/kep_03.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_03_mini.jpg"></a>
	<a href="images/galery/kep_04.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_04_mini.jpg"></a>
	<a href="images/galery/kep_05.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_05_mini.jpg"></a>
	<a href="images/galery/kep_06.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_06_mini.jpg"></a>
	<a href="images/galery/kep_07.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_07_mini.jpg"></a>
	<a href="images/galery/kep_08.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_08_mini.jpg"></a>
	<a href="images/galery/kep_09.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_09_mini.jpg"></a>
	<a href="images/galery/kep_10.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_10_mini.jpg"></a>
	<a href="images/galery/kep_11.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_11_mini.jpg"></a>
	<a href="images/galery/kep_12.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_12_mini.jpg"></a>
	<a href="images/galery/kep_13.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_13_mini.jpg"></a>
	<a href="images/galery/kep_14.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_14_mini.jpg"></a>
	<a href="images/galery/kep_15.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_15_mini.jpg"></a>
	<a href="images/galery/kep_16.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_16_mini.jpg"></a>
	<a href="images/galery/kep_17.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_17_mini.jpg"></a>
	<a href="images/galery/kep_18.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_18_mini.jpg"></a>
	<a href="images/galery/kep_19.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_19_mini.jpg"></a>
	<a href="images/galery/kep_20.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_20_mini.jpg"></a>
	<a href="images/galery/kep_21.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_21_mini.jpg"></a>
	<a href="images/galery/kep_22.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_22_mini.jpg"></a>
	<a href="images/galery/kep_23.jpg" title="The Cleaner"><img class="popup-gallery-small" src="images/galery/kep_23_mini.jpg"></a>	
</div>


<script>
	  $('.popup-gallery').magnificPopup({
		delegate: 'a',
		type: 'image',
		tLoading: 'Loading image #%curr%...',
		mainClass: 'mfp-img-mobile',
		gallery: {
			enabled: true,
			navigateByImgClick: true,
			preload: [0,1] // Will preload 0 - before current, and 1 after the current image
		},
		image: {
			tError: '<a href="%url%">The image #%curr%</a> could not be loaded.',
			titleSrc: function(item) {
				return item.el.attr('title') + '<small>by Viktor Potharn</small>';
			}
		}
	});
</script>